<template>
  <div class="table-select">
    <ItSelect
      :prop="item.prop"
      :placeholder="item.placeholder"
      :select-data="item.selectData"
      :sel-value="item.selValue"
      :replace="item.replace"
      @onSelect="handleChangeSelect"
    ></ItSelect>
  </div>
  <div class="table-select">
    <ItSelect
      :prop="item.prop"
      :placeholder="item.placeholder"
      :select-data="item.selectData"
      :sel-value="item.selValue"
      @onSelect="handleChangeSelect"
    ></ItSelect>
  </div>
  <div>选中了：{{ selectValue }}</div>
</template>
<script setup>
import { ref } from 'vue'
import { ItSelect } from '@/components'
const item = ref({
  prop: 'key',
  selectData: [
    { value: '', name: '全部' },
    { value: '1', name: '是' },
    { value: '0', name: '否' },
  ],
  selValue: '1',
  placeholder: '选择',
  replace: true,
})
const selectValue = ref('')
const handleChangeSelect = (val) => {
  selectValue.value = val.value
}
</script>
<style scoped>
.table-select {
  width: 400px;
  border: 1px solid #ccc;
  margin-bottom: 20px;
}
</style>
